<!DOCTYPE html>
<html lang="zh-Cn">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.7.9/dat.gui.min.js"></script>
    <script>
      const controlData = {
        rotationSpeed: 0.01,
        color: "#336688",
        wireframe: false,
        envMap: "无",
      };

      const gui = new dat.GUI();
      const f = gui.addFolder("控制面板");
      f.add(controlData, "rotationSpeed").min(0.001).max(0.1).step(0.01);
      f.addColor(controlData, "color");
      f.add(controlData, "envMap",["无","选项一","选项二","选项三"])
      f.add(controlData, "wireframe")
      f.open()

    </script>
  </body>
</html>
